<template>
	<div id="realName">
		<div class="title"><i class="iconfont icon-icon1"></i>欢迎来到全宇支付平台</div>
		<!--实线-->
		<div class="solid"></div>
		<div class="main">
			<h3>实名认证</h3>
			<el-form :label-position="labelPosition" label-width="90px" :model="formLabelAlign" class="form">
			<el-form-item label="姓名：">
				<el-input v-model="formLabelAlign.name" placeholder="请输入姓名" :disabled="isAditor"></el-input>
			</el-form-item>
			<el-form-item label="身份证号：">
				<el-input v-model="formLabelAlign.idCard" placeholder="请输入身份证号" :disabled="isAditor"></el-input>
			</el-form-item>
			<el-form-item label="手机号：">
				<el-input v-model="formLabelAlign.phone" placeholder="请输入手机号" :disabled="isAditor"></el-input>
			</el-form-item>
			<div><el-button type='primary' :loading="loading1" @click="checkStatus" v-text="text"></el-button></div>
			</el-form>
      <h3 v-if="isSuccess2 == 9">您已经实名认证成功</h3>
      <h3 v-if="isSuccess2 == 10">实名认证失败，请重新提交</h3>
      <h3 v-if="isSuccess2 == 11">正在审核中......</h3>
		</div>
	</div>
</template>

<script>
	export default{
		data(){
			return{
				labelPosition: 'right',
				formLabelAlign: {
					name: '',
					idCard: '',
					phone: ''
				},
				loading1:false,
				text:'提交审核',
        isAditor:false,
        isSuccess2:''
			}
		},
		created(){
          this.checkStausTwo();
          if(this.isSuccess2 == '10' || this.isSuccess2 =='11'){
                 this.loading1 = true;
          }

          if(localStorage.getItem("isAditor")){
            this.isAditor = true;
            this.formLabelAlign = localStorage.getItem("formLabelAlign");
          }
		},
		methods:{
		  checkStausTwo(){
        this.$api.checkStatus().then(res =>{
          if(res.data.code == '000000'){
            console.log(res.data);
            this.isSuccess = true;
            this.isSuccess2 = res.data.data.certificationCondition;
          }
        })
      },
			checkStatus(){
				var pattern = /\d{17}[\d|x]|\d{15}/;
				var pattern2 = /0?(13|14|15|18|17)[0-9]{9}/;
				if(this.formLabelAlign.username== ''){
					this.$message({
						type:"info",
						message:"请输入姓名"
					})
				}else if(!pattern.test(this.formLabelAlign.idCard)){
					this.$message({
						type:"info",
						message:"您输入的身份证号格式不正确！"
					})

				}else if(this.formLabelAlign.phone == ''){
					this.$message({
						type:"info",
						message:"请输入手机号！"
					})
				}else if(!pattern2.test(this.formLabelAlign.phone)){
                    this.$message({
						type:"info",
						message:"您输入的手机号格式不正确！"
					})
				}else{

				  this.$api.postRealName(this.formLabelAlign).then(res =>{
				    if(res.data.code == '000000'){
				      console.log(res.data);

              this.isAditor= true;
              localStorage.setItem("isAditor",true);
              localStorage.setItem("formLabelAlign",this.formLabelAlign);
              this.$message({
                type:'success',
                message:'实名认证成功'
              })
            }else{
              this.$message({
                type:'error',
                message:res.data.msg
              })
            }
          })


				}

			}
		}
	}
</script>

<style lang="less">
	#realName{
		padding: 20px;
		.icon-icon1 {
    font-size: 35px!important;
    margin-right: 35px;
    position: absolute;
    color: #008000;
    right: 100px;
    bottom: -8px;
}
		.title {
			text-align: right;
			font-size: 12px;
			margin-bottom: 10px;
			position: relative;
		}
		.icon-icon1{
			font-size: 25px;
		}
		.solid {
			background-color: black;
			height: 2px;
		}
		.main{

			h3{
				text-align:left;
				padding: 10px 30px;
			}
			.form{
				width: 400px;
				margin: 15px;
			}
		}
	}
</style>
